출처 : http://blog.naver.com/btchae
1. 링크 주변의 점선 테두리 없애기
onfocus='this.blur()'
<a href="big_img.htm" onfocus='this.blur()"><img src="img1.gif"></a>
2. 고스트 스크롤바를 없애려면
<body scroll="auto">
3. 가로 스크롤바가 생기지 않게 하려면
<style type="text/css">
body {overflow-x : hidden}
</style>
4. 세로 스크롤바가 생기지 않게하려면
<style type="text/css">
body {overflow-y : hidden}
</style>
5. 스크롤바를 투명하게
<style type="text/css" >
BODY
{ scrollbar-face-color: #ffffff; scrollbar-shadow-color: #F7F7F7;
scrollbar-highlight-color: #ffffff; scrollbar-3dlight-color: #F7F7F7;
scrollbar-darkshadow-color: #ffffff; scrollbar-track-color: #ffffff;
scrollbar-arrow-color: #ffffff}
< /style>
5. iframe 사용법
<iframe src="/path/jspName.jsp" name="bodyFrame" width="835"
height="295" frameborder=0 marginwidth=0 marginheight=0 scrolling=auto
></iframe>
iframe 접근은 document.bodyFrame.document.FormName
6. 파일객체의 찾아보기 버튼을 이미지로
<form name="bodyForm">
<input type="file" name="fl" style="display:none">
<input type="text" name="fileName"><img src="fileSearch.gif" onclick="document.bodyForm.fl.click()">
</form>
7. SELECT 요소에 많은 OPTION을 추가하려면 innerHTML을 사용, 성능에서 우수함.
객체아이디.innerHTML = "";
var arr = new Array(1000);
for (var i=0; i<1000; i++)
{
arr[i] = "<OPTION>Item " + i + "</OPTION>";
}
객체아이디.innerHTML = "<SELECT ID='selUpdate'>" + arr.join() + "</SELECT>";
8. 두개의 프레임의 페이지를 변경
function twoFrameChange( headFrame, bodyFrame ){
headFrame.location.href = headFrame;
bodyFrame.location.href = bodyFrame;
}
9. Body 바디관련
ㅡ기본 속성
<body background='' bgcolor='' text='' link='' vlink='' alink='' leftmargin='' topmargin=''>
ㅡ마우스 오른쪽키 막기
<Body oncontextmenu="return false">
ㅡ배경이미지 고정
<body BACKGROUND="배경 이미지주소" BGPROPERTIES="fixed">
margin=해당공백 없이 본문을 위치시키는 옵션이다. (marginheight와 marginwidth는 table, frame에만 쓰인다.)
bgcolor : 문서의 바탕 칼라를 지정한다..
background : 칼라대신 이미지를 지정한다...
text : 텍스트칼라를 지정한다.
link : 하이퍼 링크된 글자의 색을 지정한다..
vlink : 방문한 하이퍼 링크의 색을 지정한다..
10. 아래와 같이 체크박스옆의 글자를 클릭해도 체크되게
<input type="checkbox" id="direct"><label for="direct">즉시추첨</label>
11. 체크박스옆의 글자를 체크박스와 같은라인에 위치하게 맞추기
<input type="checkbox" name="2" style="height:16px;"> 체크박스
